<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>wrapper - ${num}</title>
    <!-- ZUI 标准版压缩后的 CSS 文件 -->
    <link rel="stylesheet" href="https://cdn.bootcss.com/zui/1.8.1/css/zui.min.css">
</head>
<body>
<div class="container-fluid">
    <ol class="breadcrumb">
        <li><a href="your/url/">Home</a></li>
        <li class="active"></li>
    </ol>
</div>
<div class="container-fluid">
    <div class="row">
        <div class="col-md-2">
            <ul class="nav nav-secondary  nav-stacked">
                <li><a class="nav-button" href="#" data-src="http://localhost:6574/index.html?num=1">新闻管理 </a></li>
                <li><a class="nav-button" href="#" data-src="http://localhost:6574/index.html?num=2">活动管理 </a></li>
            </ul>
        </div>
        <div class="col-md-10">
            <iframe id="view-iframe" src="" frameborder="no" border="0" width="100%" height="100%"
                    allowtransparency="yes">
                ....
            </iframe>
        </div>
    </div>
</div>
<!-- ZUI Javascript 依赖 jQuery -->
<script src="https://cdn.bootcss.com/zui/1.8.1/lib/jquery/jquery.js"></script>
<!-- ZUI 标准版压缩后的 JavaScript 文件 -->
<script src="https://cdn.bootcss.com/zui/1.8.1/js/zui.min.js"></script>
<script src="index.js"></script>
<script>
    var random = Math.random();
    var webSockets = [];
    $(".nav-button").on("click", function () {
        var src = $(this).data("src");
        $("#view-iframe").attr("src", src);
        webSockets.push(initWebSocket("ws://localhost:6574/websocket/" + random));
        setCookie("username", random);
    });
    var setCookie = function (name,value)
    {
        var Days = 1;
        var exp = new Date();
        exp.setTime(exp.getTime() + Days*24*60*60*1000);
        document.cookie = name + "="+ value + ";expires=" + exp.toGMTString();
    }
</script>
</body>

</html>